<template>
  <div class="inviteDetail">
    <van-nav-bar @click-left="$router.back()" left-arrow title="简易在线简历" fixed>
    </van-nav-bar>
    <div class="content">
      <div class="jibenmsg">
        <div class="jibenmsg-content">
          <div class="title">
            <div class="left">
              <span>|</span>
              <h2>基本信息</h2>
            </div>
            <div class="zhankaiheshousuo" @click="zhankaishousuo1">
              <span v-if="hide1">
                收起
                <img src="../../assets/images/invite/shouqi.png" alt="">
              </span>
              <span v-else>
                展开
                <img src="../../assets/images/invite/xiangxia.png" alt="">
              </span>
            </div>
          </div>
          <div class="contents" v-show="zksu1">
            <div class="contents-form">
              <van-cell-group>
                <van-field v-model="jbform.name" readonly placeholder="点击填写" type="text" label="姓名">
                </van-field>
                <van-field v-model="jbform.sex" readonly clickable label="性别" placeholder="点击选择">
                </van-field>
                <van-field v-model="jbform.chushentime" label="出生年月" readonly  placeholder="点击选择">
                </van-field>
                <van-field v-model="jbform.phone" readonly label="手机号" placeholder="点击输入">
                </van-field>
                <van-field v-model="jbform.workTime" label="参加工作时间"  readonly  placeholder="点击选择">
                </van-field>
                <van-field v-model="jbform.email" readonly label="邮箱" placeholder="点击输入">
                </van-field>
              </van-cell-group>
            </div>
          </div>
        </div>
        <div class="jibenmsg-contentss" v-for="(item,indexs) in jbform.jiaoyubeijing" :key="indexs+'list'">
          <div class="title">
            <div class="left">
              <span>|</span>
              <h2>教育背景</h2>
            </div>
            <div class="zhankaiheshousuo">
              <div class="imgs" @click="zhankaishousuo3">
                <span v-if="hide3">
                  收起
                  <img src="../../assets/images/invite/shouqi.png" alt="">
                </span>
                <span v-else>
                  展开
                  <img src="../../assets/images/invite/xiangxia.png" alt="">
                </span>
              </div>
            
            </div>
          </div>
          <div class="contents" v-show="zksu3">
            <div class="contents-form">
              <van-cell-group>
                <div>
                  <van-field v-model="item.startTime" label="开始年月"  readonly placeholder="点击选择">
                  </van-field>
                  <van-field v-model="item.endTime" label="结束年月" readonly placeholder="点击选择">
                  </van-field>
                  <van-field v-model="item.school" readonly placeholder="点击填写" type="text" label="学校">
                  </van-field>
                  <van-field v-model="item.major" readonly label="专业" placeholder="点击选择">
                  </van-field>
                  <van-field v-model="item.fullTime" readonly clickable label="是否全日制" placeholder="点击选择">
                  </van-field>
                </div>
              </van-cell-group>
            </div>
          </div>
        </div>

        <div class="jibenmsg-contentss" v-for="(item,indexs) in jbform.gongzuojingli" :key="indexs+'lists'">
          <div class="title">
            <div class="left">
              <span>|</span>
              <h2>工作经历</h2>
            </div>
            <div class="zhankaiheshousuo" @click="zhankaishousuo4">
              <span v-if="hide4">
                收起
                <img src="../../assets/images/invite/shouqi.png" alt="">
              </span>
              <span v-else>
                展开
                <img src="../../assets/images/invite/xiangxia.png" alt="">
              </span>
            </div>
          </div>
          <div class="contents" v-show="zksu4">
            <div class="contents-form">
              <van-cell-group>
                <div>
                  <van-field v-model="item.startTime" label="开始年月" readonly  placeholder="点击选择">
                  </van-field>
                  <van-field v-model="item.endTime" label="结束年月" readonly placeholder="点击选择">
                  </van-field>
                  <van-field v-model="item.companyName" readonly placeholder="点击填写" type="text" label="就职企业">
                  </van-field>
                  <van-field v-model="item.superiorName" readonly label="上级姓名" placeholder="点击选择">
                  </van-field>
                  <van-field v-model="item.superiorPhone" readonly label="上级手机号" placeholder="点击选择">
                  </van-field>
                  <van-field v-model="item.resignationReason" readonly rows="2" autosize label="离职原因" type="textarea" maxlength="350" placeholder="点击输入" show-word-limit>
                  </van-field>
                </div>
              </van-cell-group>
            </div>
          </div>
        </div>

        <div class="jibenmsg-contentss">
          <div class="title">
            <div class="left">
              <span>|</span>
              <h2>自我评价</h2>
            </div>
            <div class="zhankaiheshousuo" @click="zhankaishousuo5">
              <span v-if="hide5">
                收起
                <img src="../../assets/images/invite/shouqi.png" alt="">
              </span>
              <span v-else>
                展开
                <img src="../../assets/images/invite/xiangxia.png" alt="">
              </span>
            </div>
          </div>
          <div class="contents" v-show="zksu5">
            <div class="contents-form">
              <van-cell-group>
                <div>
                  <van-field v-model="jbform.remark" readonly rows="8" autosize type="textarea" maxlength="350" placeholder="点击填写" show-word-limit />
                </div>
              </van-cell-group>
            </div>
          </div>
        </div>

      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      //展开和收缩状态   
      hide1:true,
      zksu1:true,
      hide2:true,
      zksu2:true,
      hide3:true,
      zksu3:true,
      hide4:true,
      zksu4:true,
      hide5:true,
      zksu5:true,
      hide6:true,
      zksu6:true,
      hide7: true,
      zksu7: true,
      code: "",
      files:{},//上传的文件信息
      minDate: new Date(1980, 0, 1),
      maxDate: new Date(2025, 10, 1),
      columns: ["男", "女"],
      columnsisFullTime: ["是", "否"],
      jbform: {
        name: "",//姓名
        chushentime: "",//出身日期
        sex: "",//性别
        biyeTime: "",//毕业时间
        ziwoPrice: "",//自我评价
        phone:"",//手机号
        workTime:"",
        email:"",
        remark:"",
        // 教育背景
        jiaoyubeijing: [{
          startTime: "",
          endTime: "",
          school: "",
          major: "",
          fullTime: ""
        }],
      // 工作经历
        gongzuojingli:[
          {
          startTime: "",
          endTime: "",
          companyName: "",
          superiorName: "",
          superiorPhone: "",
          resignationReason: ""
        }
        ]
      },
      
    }
  },
  mounted(){
      this.getCustomerInfo(this.$route.query.id);
  },
  methods: {
     // 展开和收缩
    zhankaishousuo1(){
       this.hide1=!this.hide1
       this.zksu1=!this.zksu1
    },
    zhankaishousuo2(){
       this.hide2=!this.hide2
       this.zksu2=!this.zksu2
    }, 
    zhankaishousuo3(){
       this.hide3=!this.hide3
       this.zksu3=!this.zksu3
    }, 
    zhankaishousuo4(){
       this.hide4=!this.hide4
       this.zksu4=!this.zksu4
    }, 
    zhankaishousuo5(){
       this.hide5=!this.hide5
       this.zksu5=!this.zksu5
    }, 
    zhankaishousuo6(){
       this.hide6=!this.hide6
       this.zksu6=!this.zksu6
    },  
    zhankaishousuo7 () {
      this.hide7 = !this.hide7
      this.zksu7 = !this.zksu7
    },
    getCustomerInfo (id) {
        this.$api.getCustomerInfo({id:id}).then(res=>{
          this.jbform.name=res.data.name
          this.jbform.idnumber=res.data.idCard
          this.jbform.workTime=res.data.workTime
          this.jbform.email=res.data.email
          this.jbform.sex=res.data.gender
          this.jbform.chushentime=res.data.birth
          this.jbform.jiguan=res.data.nativePlace
          this.jbform.mingzu=res.data.nation
          this.jbform.huiyinzk=res.data.marriage
          this.jbform.height=res.data.height
          this.jbform.weight=res.data.weight
          this.jbform.politicalStatus=res.data.politicalStatus
          this.jbform.qqNumber=res.data.qqNumber
          this.jbform.wxNumber=res.data.weChatNo
          this.jbform.phone=res.data.phone
          this.jbform.hobby=res.data.interests
          this.jbform.speciality=res.data.speciality
          this.jbform.accountAddress=res.data.accountAddress
          this.jbform.detailedAddress=res.data.accountAddress
          this.jbform.biyeSchool=res.data.graduate
          this.jbform.biyeTime=res.data.graduateTime
          this.jbform.education=res.data.education
          this.jbform.certificate=res.data.certificate
          this.jbform.computerSp=res.data.computers
          this.jbform.waiyuSp=res.data.foreignLanguages
          this.jbform.jiating=res.data.crmFamilyMember
          this.jbform.remark=res.data.remark
          this.jbform.gongzuojingli=res.data.crmWorkExperienceEntity
           this.jbform.jiaoyubeijing=res.data.crmPersonnelEducationEntity
        })
    },
  
    // 处理时间的方法
    disposeDate (now) {
      var year = now.getFullYear(); //年
      var month = now.getMonth() + 1; //月
      var day = now.getDate(); //日

      if (String(month).length != 2) {
        month = 0 + String(month);
      }
      if (String(day).length != 2) {
        day = 0 + String(day);
      }

      return `${year}-${month}-${day}`;
    },
  }
}
</script>

<style lang="less" scoped>
.van-nav-bar__right {
  img {
    width: 15px;
    height: 15px;
  }
}
.content {
  width: 100%;
  height: auto;
  overflow: hidden;
  background-image: url('../../assets/images/invite/zxjl.png');
  background-repeat: no-repeat;
  background-size: 100%;
  .btn {
    width: 70%;
    height: 52px;
    opacity: 1;
    background: linear-gradient(180deg, #6ce5e6, #4956f2);
    border-radius: 41px;
    text-align: center;
    line-height: 50px;
    margin: 20px auto;
  }
  .jibenmsg {
    padding: 10px;
    .jibenmsg-content {
      width: 100%;
      height: auto;
      background-color: #3556cd;
      line-height: 40px;
      margin: 0 auto;
      margin-top: 260px;
      .title {
        color: #fff;
        width: 100%;
        height: auto;
        display: flex;
        margin-left: 10px;
        justify-content: space-between;
        .left {
          display: flex;
          span {
            font-size: 25px;
            margin-top: -2px;
          }
          h2 {
            padding-left: 6px;
            font-size: 18px;
          }
        }
        .zhankaiheshousuo {
          margin-right: 20px;

          span {
            img {
              width: 10px;
              height: 10px;
            }
          }
        }
      }
      .contents {
        width: 100%;
        height: auto;
        background-color: #fff;
      }
    }

    .jibenmsg-contentss {
      width: 100%;
      height: auto;
      background-color: #3556cd;
      line-height: 40px;
      .title {
        color: #fff;
        width: 100%;
        height: auto;
        display: flex;
        margin-left: 10px;
        justify-content: space-between;
        margin-top: 15px;
        .left {
          display: flex;
          span {
            font-size: 25px;
            margin-top: -2px;
          }
          h2 {
            padding-left: 6px;
            font-size: 18px;
          }
        }
        .zhankaiheshousuo {
          margin-right: 20px;
          span {
            img {
              width: 10px;
              height: 10px;
            }
          }
        }
      }
      .contents {
        width: 100%;
        height: auto;
        background-color: #fff;
        .text {
          text-align: center;
          color: #3556cd;
        }
        .contents-formtitle {
          display: flex;
          justify-content: space-between;
          .van-radio {
            margin-top: 10px;
            margin-right: 10px;
          }
          h3 {
            margin-left: 10px;
          }
          .contents-left{
              width: 20%;
              img{
                  width:40px;
                  height: 50px;
                  display: block;
                  margin: 10px auto;
              }
          }
          .contents-center{
              width: 60%;
              margin-right: 40px;
              span{
                  display: block;
                  margin-top: 4px;
              }
              p{
                  color: #999;
                  margin-top: -8px;
                  font-size: 12px;
              }
          }
          .contents-right{
              margin-right: 20px;
              color:red;
              line-height: 60px;
              .van-icon{
                margin-top: 30px;
              }
          }
        }
        .contents-formMsg {
          padding: 10px;
          line-height: 30px;
          color: #666666;
          span {
            font-size: 13px;
          }
        }
      }
    }
    .jibenmsg-contentsss {
      width: 100%;
      height: auto;
      background-color: #3556cd;
      line-height: 40px;
      .title {
        color: #fff;
        width: 100%;
        height: auto;
        display: flex;
        margin-left: 10px;
        justify-content: space-between;
        margin-top: 15px;
        .left {
          display: flex;
          span {
            font-size: 25px;
            margin-top: -2px;
          }
          h2 {
            padding-left: 6px;
            font-size: 18px;
          }
        }
        .zhankaiheshousuo {
          display: flex;
          margin-right: 20px;
          .imgs {
            margin-right: 10px;
            span {
              img {
                width: 10px;
                height: 10px;
              }
            }
          }
        }
      }
      .contents {
        width: 100%;
        height: auto;
        background-color: #fff;
        .text {
          text-align: center;
          color: #3556cd;
        }
        .contents-formtitle {
          display: flex;
          justify-content: space-between;
          .van-radio {
            margin-top: 10px;
            margin-right: 10px;
          }
          h3 {
            margin-left: 10px;
          }
        }
        .contents-formMsg {
          padding: 10px;
          line-height: 30px;
          color: #666666;
          span {
            font-size: 13px;
          }
        }
      }
    }
  }
}
</style>